<style type="text/css">
#left-content, #right-content {
	float: left;
}

#left-content {
	width: 640px;
	box-sizing: border-box;
	box-shadow: 0px 0px 0px 1px #E8E9EB;
	min-height: 600px;
}

#right-content {
	width: 320px;
}

#new-lesson, #nav-menu {
	font-weight: bolder;
	padding: 20px;
}

.lesson-list {
	padding: 20px;
	box-sizing: border-box;
	padding: 20px;
}

.nav-list {
	background: whiteSmoke;
	border-left: 1px solid #E8E9EB;
	border-bottom: 1px solid #E8E9EB;
	line-height: 40px;
	text-indent: 20px;
	cursor: pointer;
}

.nav-list:first-child {
	border-top: 1px solid #E8E9EB;
}

.nav-list.select {
	background: white;
	border-left: none;
}
</style>
<div id="container">
	<div id="left-content">
	</div>
	<div id="right-content">
		<ul style="margin-top: 20px;">
			<li class="nav-list"><a href="<?php echo $this->createUrl('lesson/search');?>">ค้นหาบทเรียน</a></li>
			<li class="nav-list"><a href="<?php echo $this->createUrl('lesson/create');?>">สร้างบทเรียน</a></li>
			<li class="nav-list"><a href="<?php echo $this->createUrl('user/seescore');?>">ดูคะแนนบททดสอบ</a></li>
		</ul>
	</div>
</div>
<script type="text/javascript">
$(function(){
	$('.nav-list').click(function(event){
		event.preventDefault();
		$(this).addClass('select').siblings().removeClass('select');
		var url = $(this).find('a').attr('href');
		$('#left-content').load(url,function(){
			// statement
		});
	});
	$('.nav-list:first').click();
});
</script>